<template>
    <ul class="icon_lists">

        <li>
            <Icon iconname="add"/>
            <div class="name">add</div>
        </li>

        <li>
            <Icon iconname="albums"/>
            <div class="name">albums</div>
        </li>

        <li>
            <Icon iconname="alarm"/>
            <div class="name">alarm</div>
        </li>

        <li>
            <Icon iconname="add-circle"/>
            <div class="name">add-circle</div>
        </li>

        <li>
            <Icon iconname="add-circle-outline"/>
            <div class="name">add-circle-outline</div>
        </li>

        <li>
            <Icon iconname="alert"/>
            <div class="name">alert</div>
        </li>

        <li>
            <Icon iconname="airplane"/>
            <div class="name">airplane</div>
        </li>

        <li>
            <Icon iconname="aperture"/>
            <div class="name">aperture</div>
        </li>

        <li>
            <Icon iconname="analytics"/>
            <div class="name">analytics</div>
        </li>

        <li>
            <Icon iconname="apps"/>
            <div class="name">apps</div>
        </li>

        <li>
            <Icon iconname="archive"/>
            <div class="name">archive</div>
        </li>

        <li>
            <Icon iconname="appstore"/>
            <div class="name">appstore</div>
        </li>

        <li>
            <Icon iconname="arrow-down"/>
            <div class="name">arrow-down</div>
        </li>

        <li>
            <Icon iconname="arrow-back"/>
            <div class="name">arrow-back</div>
        </li>

        <li>
            <Icon iconname="arrow-dropdown-circl"/>
            <div class="name">arrow-dropdown-circl</div>
        </li>

        <li>
            <Icon iconname="arrow-dropdown"/>
            <div class="name">arrow-dropdown</div>
        </li>

        <li>
            <Icon iconname="arrow-dropleft-circl"/>
            <div class="name">arrow-dropleft-circl</div>
        </li>

        <li>
            <Icon iconname="arrow-dropleft"/>
            <div class="name">arrow-dropleft</div>
        </li>

        <li>
            <Icon iconname="arrow-dropright-circ"/>
            <div class="name">arrow-dropright-circ</div>
        </li>

        <li>
            <Icon iconname="arrow-forward"/>
            <div class="name">arrow-forward</div>
        </li>

        <li>
            <Icon iconname="arrow-dropright"/>
            <div class="name">arrow-dropright</div>
        </li>

        <li>
            <Icon iconname="arrow-dropup-circle"/>
            <div class="name">arrow-dropup-circle</div>
        </li>

        <li>
            <Icon iconname="arrow-dropup"/>
            <div class="name">arrow-dropup</div>
        </li>

        <li>
            <Icon iconname="arrow-round-down"/>
            <div class="name">arrow-round-down</div>
        </li>

        <li>
            <Icon iconname="arrow-round-back"/>
            <div class="name">arrow-round-back</div>
        </li>

        <li>
            <Icon iconname="arrow-round-forward"/>
            <div class="name">arrow-round-forward</div>
        </li>

        <li>
            <Icon iconname="arrow-round-up"/>
            <div class="name">arrow-round-up</div>
        </li>

        <li>
            <Icon iconname="arrow-up"/>
            <div class="name">arrow-up</div>
        </li>

        <li>
            <Icon iconname="at"/>
            <div class="name">at</div>
        </li>

        <li>
            <Icon iconname="backspace"/>
            <div class="name">backspace</div>
        </li>

        <li>
            <Icon iconname="battery-charging"/>
            <div class="name">battery-charging</div>
        </li>

        <li>
            <Icon iconname="battery-dead"/>
            <div class="name">battery-dead</div>
        </li>

        <li>
            <Icon iconname="battery-full"/>
            <div class="name">battery-full</div>
        </li>

        <li>
            <Icon iconname="bluetooth"/>
            <div class="name">bluetooth</div>
        </li>

        <li>
            <Icon iconname="body"/>
            <div class="name">body</div>
        </li>

        <li>
            <Icon iconname="bookmarks"/>
            <div class="name">bookmarks</div>
        </li>

        <li>
            <Icon iconname="bonfire"/>
            <div class="name">bonfire</div>
        </li>

        <li>
            <Icon iconname="book"/>
            <div class="name">book</div>
        </li>

        <li>
            <Icon iconname="bookmark"/>
            <div class="name">bookmark</div>
        </li>

        <li>
            <Icon iconname="briefcase"/>
            <div class="name">briefcase</div>
        </li>

        <li>
            <Icon iconname="browsers"/>
            <div class="name">browsers</div>
        </li>

        <li>
            <Icon iconname="brush"/>
            <div class="name">brush</div>
        </li>

        <li>
            <Icon iconname="build"/>
            <div class="name">build</div>
        </li>

        <li>
            <Icon iconname="bug"/>
            <div class="name">bug</div>
        </li>

        <li>
            <Icon iconname="cafe"/>
            <div class="name">cafe</div>
        </li>

        <li>
            <Icon iconname="bulb"/>
            <div class="name">bulb</div>
        </li>

        <li>
            <Icon iconname="calculator"/>
            <div class="name">calculator</div>
        </li>

        <li>
            <Icon iconname="calendar"/>
            <div class="name">calendar</div>
        </li>

        <li>
            <Icon iconname="call"/>
            <div class="name">call</div>
        </li>

        <li>
            <Icon iconname="wifi"/>
            <div class="name">wifi</div>
        </li>

        <li>
            <Icon iconname="water"/>
            <div class="name">water</div>
        </li>

        <li>
            <Icon iconname="volume-mute"/>
            <div class="name">volume-mute</div>
        </li>

        <li>
            <Icon iconname="wallet"/>
            <div class="name">wallet</div>
        </li>

        <li>
            <Icon iconname="volume-high"/>
            <div class="name">volume-high</div>
        </li>

        <li>
            <Icon iconname="volume-off"/>
            <div class="name">volume-off</div>
        </li>

        <li>
            <Icon iconname="volume-low"/>
            <div class="name">volume-low</div>
        </li>

        <li>
            <Icon iconname="undo"/>
            <div class="name">undo</div>
        </li>

        <li>
            <Icon iconname="unlock"/>
            <div class="name">unlock</div>
        </li>

        <li>
            <Icon iconname="card"/>
            <div class="name">card</div>
        </li>

        <li>
            <Icon iconname="chatboxes"/>
            <div class="name">chatboxes</div>
        </li>

        <li>
            <Icon iconname="chatbubbles"/>
            <div class="name">chatbubbles</div>
        </li>

        <li>
            <Icon iconname="checkbox-outline"/>
            <div class="name">checkbox-outline</div>
        </li>

        <li>
            <Icon iconname="checkbox"/>
            <div class="name">checkbox</div>
        </li>

        <li>
            <Icon iconname="checkmark"/>
            <div class="name">checkmark</div>
        </li>

        <li>
            <Icon iconname="checkmark-circle"/>
            <div class="name">checkmark-circle</div>
        </li>

        <li>
            <Icon iconname="checkmark-circle-out"/>
            <div class="name">checkmark-circle-out</div>
        </li>

        <li>
            <Icon iconname="close-circle-outline"/>
            <div class="name">close-circle-outline</div>
        </li>

        <li>
            <Icon iconname="cloud-circle"/>
            <div class="name">cloud-circle</div>
        </li>

        <li>
            <Icon iconname="close"/>
            <div class="name">close</div>
        </li>

        <li>
            <Icon iconname="close-circle"/>
            <div class="name">close-circle</div>
        </li>

        <li>
            <Icon iconname="cloud-done"/>
            <div class="name">cloud-done</div>
        </li>

        <li>
            <Icon iconname="clock"/>
            <div class="name">clock</div>
        </li>

        <li>
            <Icon iconname="cloud-download"/>
            <div class="name">cloud-download</div>
        </li>

        <li>
            <Icon iconname="cloud"/>
            <div class="name">cloud</div>
        </li>

        <li>
            <Icon iconname="cloud-outline"/>
            <div class="name">cloud-outline</div>
        </li>

        <li>
            <Icon iconname="cloud-upload"/>
            <div class="name">cloud-upload</div>
        </li>

        <li>
            <Icon iconname="cloudy"/>
            <div class="name">cloudy</div>
        </li>

        <li>
            <Icon iconname="cloudy-night"/>
            <div class="name">cloudy-night</div>
        </li>

        <li>
            <Icon iconname="code-working"/>
            <div class="name">code-working</div>
        </li>

        <li>
            <Icon iconname="code"/>
            <div class="name">code</div>
        </li>

        <li>
            <Icon iconname="code-download"/>
            <div class="name">code-download</div>
        </li>

        <li>
            <Icon iconname="color-filter"/>
            <div class="name">color-filter</div>
        </li>

        <li>
            <Icon iconname="cog"/>
            <div class="name">cog</div>
        </li>

        <li>
            <Icon iconname="compass"/>
            <div class="name">compass</div>
        </li>

        <li>
            <Icon iconname="color-palette"/>
            <div class="name">color-palette</div>
        </li>

        <li>
            <Icon iconname="color-wand"/>
            <div class="name">color-wand</div>
        </li>

        <li>
            <Icon iconname="construct"/>
            <div class="name">construct</div>
        </li>

        <li>
            <Icon iconname="contrast"/>
            <div class="name">contrast</div>
        </li>

        <li>
            <Icon iconname="contact"/>
            <div class="name">contact</div>
        </li>

        <li>
            <Icon iconname="contacts"/>
            <div class="name">contacts</div>
        </li>

        <li>
            <Icon iconname="contract"/>
            <div class="name">contract</div>
        </li>

        <li>
            <Icon iconname="copy"/>
            <div class="name">copy</div>
        </li>

        <li>
            <Icon iconname="cube"/>
            <div class="name">cube</div>
        </li>

        <li>
            <Icon iconname="crop"/>
            <div class="name">crop</div>
        </li>

        <li>
            <Icon iconname="cut"/>
            <div class="name">cut</div>
        </li>

        <li>
            <Icon iconname="create"/>
            <div class="name">create</div>
        </li>

        <li>
            <Icon iconname="desktop"/>
            <div class="name">desktop</div>
        </li>

        <li>
            <Icon iconname="disc"/>
            <div class="name">disc</div>
        </li>

        <li>
            <Icon iconname="document"/>
            <div class="name">document</div>
        </li>

        <li>
            <Icon iconname="done-all"/>
            <div class="name">done-all</div>
        </li>

        <li>
            <Icon iconname="egg"/>
            <div class="name">egg</div>
        </li>

        <li>
            <Icon iconname="download"/>
            <div class="name">download</div>
        </li>

        <li>
            <Icon iconname="exit"/>
            <div class="name">exit</div>
        </li>

        <li>
            <Icon iconname="expand"/>
            <div class="name">expand</div>
        </li>

        <li>
            <Icon iconname="eye"/>
            <div class="name">eye</div>
        </li>

        <li>
            <Icon iconname="eye-off"/>
            <div class="name">eye-off</div>
        </li>

        <li>
            <Icon iconname="fastforward"/>
            <div class="name">fastforward</div>
        </li>

        <li>
            <Icon iconname="film"/>
            <div class="name">film</div>
        </li>

        <li>
            <Icon iconname="female"/>
            <div class="name">female</div>
        </li>

        <li>
            <Icon iconname="filing"/>
            <div class="name">filing</div>
        </li>

        <li>
            <Icon iconname="fitness"/>
            <div class="name">fitness</div>
        </li>

        <li>
            <Icon iconname="flag"/>
            <div class="name">flag</div>
        </li>

        <li>
            <Icon iconname="flame"/>
            <div class="name">flame</div>
        </li>

        <li>
            <Icon iconname="finger-print"/>
            <div class="name">finger-print</div>
        </li>

        <li>
            <Icon iconname="flash-off"/>
            <div class="name">flash-off</div>
        </li>

        <li>
            <Icon iconname="flash"/>
            <div class="name">flash</div>
        </li>

        <li>
            <Icon iconname="flashlight"/>
            <div class="name">flashlight</div>
        </li>

        <li>
            <Icon iconname="flask"/>
            <div class="name">flask</div>
        </li>

        <li>
            <Icon iconname="folder-open"/>
            <div class="name">folder-open</div>
        </li>

        <li>
            <Icon iconname="folder"/>
            <div class="name">folder</div>
        </li>

        <li>
            <Icon iconname="flower"/>
            <div class="name">flower</div>
        </li>

        <li>
            <Icon iconname="football"/>
            <div class="name">football</div>
        </li>

        <li>
            <Icon iconname="funnel"/>
            <div class="name">funnel</div>
        </li>

        <li>
            <Icon iconname="gift"/>
            <div class="name">gift</div>
        </li>

        <li>
            <Icon iconname="git-branch"/>
            <div class="name">git-branch</div>
        </li>

        <li>
            <Icon iconname="git-merge"/>
            <div class="name">git-merge</div>
        </li>

        <li>
            <Icon iconname="git-commit"/>
            <div class="name">git-commit</div>
        </li>

        <li>
            <Icon iconname="git-network"/>
            <div class="name">git-network</div>
        </li>

        <li>
            <Icon iconname="git-compare"/>
            <div class="name">git-compare</div>
        </li>

        <li>
            <Icon iconname="glasses"/>
            <div class="name">glasses</div>
        </li>

        <li>
            <Icon iconname="git-pull-request"/>
            <div class="name">git-pull-request</div>
        </li>

        <li>
            <Icon iconname="globe"/>
            <div class="name">globe</div>
        </li>

        <li>
            <Icon iconname="grid"/>
            <div class="name">grid</div>
        </li>

        <li>
            <Icon iconname="hand"/>
            <div class="name">hand</div>
        </li>

        <li>
            <Icon iconname="happy"/>
            <div class="name">happy</div>
        </li>

        <li>
            <Icon iconname="hammer"/>
            <div class="name">hammer</div>
        </li>

        <li>
            <Icon iconname="heart-dislike"/>
            <div class="name">heart-dislike</div>
        </li>

        <li>
            <Icon iconname="headset"/>
            <div class="name">headset</div>
        </li>

        <li>
            <Icon iconname="heart-empty"/>
            <div class="name">heart-empty</div>
        </li>

        <li>
            <Icon iconname="help-buoy"/>
            <div class="name">help-buoy</div>
        </li>

        <li>
            <Icon iconname="heart"/>
            <div class="name">heart</div>
        </li>

        <li>
            <Icon iconname="heart-half"/>
            <div class="name">heart-half</div>
        </li>

        <li>
            <Icon iconname="help-circle-outline"/>
            <div class="name">help-circle-outline</div>
        </li>

        <li>
            <Icon iconname="help-circle"/>
            <div class="name">help-circle</div>
        </li>

        <li>
            <Icon iconname="help"/>
            <div class="name">help</div>
        </li>

        <li>
            <Icon iconname="home"/>
            <div class="name">home</div>
        </li>

        <li>
            <Icon iconname="hourglass"/>
            <div class="name">hourglass</div>
        </li>

        <li>
            <Icon iconname="ice-cream"/>
            <div class="name">ice-cream</div>
        </li>

        <li>
            <Icon iconname="image"/>
            <div class="name">image</div>
        </li>

        <li>
            <Icon iconname="images"/>
            <div class="name">images</div>
        </li>

        <li>
            <Icon iconname="infinite"/>
            <div class="name">infinite</div>
        </li>

        <li>
            <Icon iconname="information-circle-o"/>
            <div class="name">information-circle-o</div>
        </li>

        <li>
            <Icon iconname="information"/>
            <div class="name">information</div>
        </li>

        <li>
            <Icon iconname="information-circle"/>
            <div class="name">information-circle</div>
        </li>

        <li>
            <Icon iconname="jet"/>
            <div class="name">jet</div>
        </li>

        <li>
            <Icon iconname="journal"/>
            <div class="name">journal</div>
        </li>

        <li>
            <Icon iconname="key"/>
            <div class="name">key</div>
        </li>

        <li>
            <Icon iconname="keypad"/>
            <div class="name">keypad</div>
        </li>

        <li>
            <Icon iconname="laptop"/>
            <div class="name">laptop</div>
        </li>

        <li>
            <Icon iconname="leaf"/>
            <div class="name">leaf</div>
        </li>

        <li>
            <Icon iconname="list-box"/>
            <div class="name">list-box</div>
        </li>

        <li>
            <Icon iconname="list"/>
            <div class="name">list</div>
        </li>

        <li>
            <Icon iconname="link"/>
            <div class="name">link</div>
        </li>

        <li>
            <Icon iconname="locate"/>
            <div class="name">locate</div>
        </li>

        <li>
            <Icon iconname="lock"/>
            <div class="name">lock</div>
        </li>

        <li>
            <Icon iconname="log-out"/>
            <div class="name">log-out</div>
        </li>

        <li>
            <Icon iconname="log-in"/>
            <div class="name">log-in</div>
        </li>

        <li>
            <Icon iconname="magnet"/>
            <div class="name">magnet</div>
        </li>

        <li>
            <Icon iconname="mail-open"/>
            <div class="name">mail-open</div>
        </li>

        <li>
            <Icon iconname="mail-unread"/>
            <div class="name">mail-unread</div>
        </li>

        <li>
            <Icon iconname="mail"/>
            <div class="name">mail</div>
        </li>

        <li>
            <Icon iconname="male"/>
            <div class="name">male</div>
        </li>

        <li>
            <Icon iconname="man"/>
            <div class="name">man</div>
        </li>

        <li>
            <Icon iconname="map"/>
            <div class="name">map</div>
        </li>

        <li>
            <Icon iconname="medal"/>
            <div class="name">medal</div>
        </li>

        <li>
            <Icon iconname="medical"/>
            <div class="name">medical</div>
        </li>

        <li>
            <Icon iconname="medkit"/>
            <div class="name">medkit</div>
        </li>

        <li>
            <Icon iconname="menu"/>
            <div class="name">menu</div>
        </li>

        <li>
            <Icon iconname="megaphone"/>
            <div class="name">megaphone</div>
        </li>

        <li>
            <Icon iconname="mic-off"/>
            <div class="name">mic-off</div>
        </li>

        <li>
            <Icon iconname="moon"/>
            <div class="name">moon</div>
        </li>

        <li>
            <Icon iconname="mic"/>
            <div class="name">mic</div>
        </li>

        <li>
            <Icon iconname="more"/>
            <div class="name">more</div>
        </li>

        <li>
            <Icon iconname="move"/>
            <div class="name">move</div>
        </li>

        <li>
            <Icon iconname="musical-note"/>
            <div class="name">musical-note</div>
        </li>

        <li>
            <Icon iconname="microphone"/>
            <div class="name">microphone</div>
        </li>

        <li>
            <Icon iconname="navigate"/>
            <div class="name">navigate</div>
        </li>

        <li>
            <Icon iconname="musical-notes"/>
            <div class="name">musical-notes</div>
        </li>

        <li>
            <Icon iconname="notifications-off"/>
            <div class="name">notifications-off</div>
        </li>

        <li>
            <Icon iconname="notifications"/>
            <div class="name">notifications</div>
        </li>

        <li>
            <Icon iconname="nuclear"/>
            <div class="name">nuclear</div>
        </li>

        <li>
            <Icon iconname="notifications-outlin"/>
            <div class="name">notifications-outlin</div>
        </li>

        <li>
            <Icon iconname="open"/>
            <div class="name">open</div>
        </li>

        <li>
            <Icon iconname="options"/>
            <div class="name">options</div>
        </li>

        <li>
            <Icon iconname="nutrition"/>
            <div class="name">nutrition</div>
        </li>

        <li>
            <Icon iconname="paper-plane"/>
            <div class="name">paper-plane</div>
        </li>

        <li>
            <Icon iconname="paper"/>
            <div class="name">paper</div>
        </li>

        <li>
            <Icon iconname="outlet"/>
            <div class="name">outlet</div>
        </li>

        <li>
            <Icon iconname="pause"/>
            <div class="name">pause</div>
        </li>

        <li>
            <Icon iconname="paw"/>
            <div class="name">paw</div>
        </li>

        <li>
            <Icon iconname="partly-sunny"/>
            <div class="name">partly-sunny</div>
        </li>

        <li>
            <Icon iconname="people"/>
            <div class="name">people</div>
        </li>

        <li>
            <Icon iconname="person"/>
            <div class="name">person</div>
        </li>

        <li>
            <Icon iconname="person-add"/>
            <div class="name">person-add</div>
        </li>

        <li>
            <Icon iconname="phone-landscape"/>
            <div class="name">phone-landscape</div>
        </li>

        <li>
            <Icon iconname="phone-portrait"/>
            <div class="name">phone-portrait</div>
        </li>

        <li>
            <Icon iconname="pie"/>
            <div class="name">pie</div>
        </li>

        <li>
            <Icon iconname="photos"/>
            <div class="name">photos</div>
        </li>

        <li>
            <Icon iconname="pin"/>
            <div class="name">pin</div>
        </li>

        <li>
            <Icon iconname="pint"/>
            <div class="name">pint</div>
        </li>

        <li>
            <Icon iconname="pizza"/>
            <div class="name">pizza</div>
        </li>

        <li>
            <Icon iconname="play"/>
            <div class="name">play</div>
        </li>

        <li>
            <Icon iconname="play-circle"/>
            <div class="name">play-circle</div>
        </li>

        <li>
            <Icon iconname="podium"/>
            <div class="name">podium</div>
        </li>

        <li>
            <Icon iconname="planet"/>
            <div class="name">planet</div>
        </li>

        <li>
            <Icon iconname="power"/>
            <div class="name">power</div>
        </li>

        <li>
            <Icon iconname="pricetag"/>
            <div class="name">pricetag</div>
        </li>

        <li>
            <Icon iconname="pricetags"/>
            <div class="name">pricetags</div>
        </li>

        <li>
            <Icon iconname="print"/>
            <div class="name">print</div>
        </li>

        <li>
            <Icon iconname="pulse"/>
            <div class="name">pulse</div>
        </li>

        <li>
            <Icon iconname="qr-scanner"/>
            <div class="name">qr-scanner</div>
        </li>

        <li>
            <Icon iconname="quote"/>
            <div class="name">quote</div>
        </li>

        <li>
            <Icon iconname="radio-button-off"/>
            <div class="name">radio-button-off</div>
        </li>

        <li>
            <Icon iconname="radio-button-on"/>
            <div class="name">radio-button-on</div>
        </li>

        <li>
            <Icon iconname="radio"/>
            <div class="name">radio</div>
        </li>

        <li>
            <Icon iconname="rainy"/>
            <div class="name">rainy</div>
        </li>

        <li>
            <Icon iconname="recording"/>
            <div class="name">recording</div>
        </li>

        <li>
            <Icon iconname="redo"/>
            <div class="name">redo</div>
        </li>

        <li>
            <Icon iconname="refresh-circle"/>
            <div class="name">refresh-circle</div>
        </li>

        <li>
            <Icon iconname="refresh"/>
            <div class="name">refresh</div>
        </li>

        <li>
            <Icon iconname="remove-circle-outlin"/>
            <div class="name">remove-circle-outlin</div>
        </li>

        <li>
            <Icon iconname="remove-circle"/>
            <div class="name">remove-circle</div>
        </li>

        <li>
            <Icon iconname="remove"/>
            <div class="name">remove</div>
        </li>

        <li>
            <Icon iconname="resize"/>
            <div class="name">resize</div>
        </li>

        <li>
            <Icon iconname="reorder"/>
            <div class="name">reorder</div>
        </li>

        <li>
            <Icon iconname="repeat"/>
            <div class="name">repeat</div>
        </li>

        <li>
            <Icon iconname="restaurant"/>
            <div class="name">restaurant</div>
        </li>

        <li>
            <Icon iconname="return-left"/>
            <div class="name">return-left</div>
        </li>

        <li>
            <Icon iconname="reverse-camera"/>
            <div class="name">reverse-camera</div>
        </li>

        <li>
            <Icon iconname="rewind"/>
            <div class="name">rewind</div>
        </li>

        <li>
            <Icon iconname="return-right"/>
            <div class="name">return-right</div>
        </li>

        <li>
            <Icon iconname="ribbon"/>
            <div class="name">ribbon</div>
        </li>

        <li>
            <Icon iconname="rose"/>
            <div class="name">rose</div>
        </li>

        <li>
            <Icon iconname="sad"/>
            <div class="name">sad</div>
        </li>

        <li>
            <Icon iconname="rocket"/>
            <div class="name">rocket</div>
        </li>

        <li>
            <Icon iconname="save"/>
            <div class="name">save</div>
        </li>

        <li>
            <Icon iconname="school"/>
            <div class="name">school</div>
        </li>

        <li>
            <Icon iconname="search"/>
            <div class="name">search</div>
        </li>

        <li>
            <Icon iconname="send"/>
            <div class="name">send</div>
        </li>

        <li>
            <Icon iconname="share-alt"/>
            <div class="name">share-alt</div>
        </li>

        <li>
            <Icon iconname="settings"/>
            <div class="name">settings</div>
        </li>

        <li>
            <Icon iconname="share"/>
            <div class="name">share</div>
        </li>

        <li>
            <Icon iconname="shuffle"/>
            <div class="name">shuffle</div>
        </li>

        <li>
            <Icon iconname="shirt"/>
            <div class="name">shirt</div>
        </li>

        <li>
            <Icon iconname="skip-backward"/>
            <div class="name">skip-backward</div>
        </li>

        <li>
            <Icon iconname="skip-forward"/>
            <div class="name">skip-forward</div>
        </li>

        <li>
            <Icon iconname="speedometer"/>
            <div class="name">speedometer</div>
        </li>

        <li>
            <Icon iconname="snow"/>
            <div class="name">snow</div>
        </li>

        <li>
            <Icon iconname="square"/>
            <div class="name">square</div>
        </li>

        <li>
            <Icon iconname="star-half"/>
            <div class="name">star-half</div>
        </li>

        <li>
            <Icon iconname="square-outline"/>
            <div class="name">square-outline</div>
        </li>

        <li>
            <Icon iconname="star-outline"/>
            <div class="name">star-outline</div>
        </li>

        <li>
            <Icon iconname="star"/>
            <div class="name">star</div>
        </li>

        <li>
            <Icon iconname="stats"/>
            <div class="name">stats</div>
        </li>

        <li>
            <Icon iconname="stopwatch"/>
            <div class="name">stopwatch</div>
        </li>

        <li>
            <Icon iconname="subway"/>
            <div class="name">subway</div>
        </li>

        <li>
            <Icon iconname="swap"/>
            <div class="name">swap</div>
        </li>

        <li>
            <Icon iconname="sunny"/>
            <div class="name">sunny</div>
        </li>

        <li>
            <Icon iconname="switch"/>
            <div class="name">switch</div>
        </li>

        <li>
            <Icon iconname="tablet-landscape"/>
            <div class="name">tablet-landscape</div>
        </li>

        <li>
            <Icon iconname="sync"/>
            <div class="name">sync</div>
        </li>

        <li>
            <Icon iconname="tablet-portrait"/>
            <div class="name">tablet-portrait</div>
        </li>

        <li>
            <Icon iconname="tennisball"/>
            <div class="name">tennisball</div>
        </li>

        <li>
            <Icon iconname="text"/>
            <div class="name">text</div>
        </li>

        <li>
            <Icon iconname="thermometer"/>
            <div class="name">thermometer</div>
        </li>

        <li>
            <Icon iconname="thumbs-down"/>
            <div class="name">thumbs-down</div>
        </li>

        <li>
            <Icon iconname="thunderstorm"/>
            <div class="name">thunderstorm</div>
        </li>

        <li>
            <Icon iconname="thumbs-up"/>
            <div class="name">thumbs-up</div>
        </li>

        <li>
            <Icon iconname="today"/>
            <div class="name">today</div>
        </li>

        <li>
            <Icon iconname="timer"/>
            <div class="name">timer</div>
        </li>

        <li>
            <Icon iconname="train"/>
            <div class="name">train</div>
        </li>

        <li>
            <Icon iconname="time"/>
            <div class="name">time</div>
        </li>

        <li>
            <Icon iconname="transgender"/>
            <div class="name">transgender</div>
        </li>

        <li>
            <Icon iconname="trash"/>
            <div class="name">trash</div>
        </li>

        <li>
            <Icon iconname="trending-down"/>
            <div class="name">trending-down</div>
        </li>

        <li>
            <Icon iconname="trending-up"/>
            <div class="name">trending-up</div>
        </li>

        <li>
            <Icon iconname="tv"/>
            <div class="name">tv</div>
        </li>

        <li>
            <Icon iconname="trophy"/>
            <div class="name">trophy</div>
        </li>

        <li>
            <Icon iconname="umbrella"/>
            <div class="name">umbrella</div>
        </li>

        <li>
            <Icon iconname="undo1"/>
            <div class="name">undo</div>
        </li>

        <li>
            <Icon iconname="unlock1"/>
            <div class="name">unlock</div>
        </li>

        <li>
            <Icon iconname="videocam"/>
            <div class="name">videocam</div>
        </li>

    </ul>
</template>
<style lang="scss">
    .icon_lists{
        font-size: 34px;
        display: flex;
        flex-wrap: wrap;
        justify-content: space-between;
        padding: 10px;
        >li{
            margin: 5px;
            padding: 10px;
            border:1px solid #dedede;
            border-radius: 10px;
        }
        .name{
            font-size: 16px;
        }
    }
</style>
